<template>
    <van-form @submit="OnSubmit">
        <van-field
            v-model="business.email"
            name="email"
            label="邮箱"
            placeholder="请输入邮箱"
            readonly
            :rules="[
                { required: true, message: '请输入邮箱' },
                {
                    pattern: /^[a-zA-Z0-9._%+-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,}$/,
                    message: '邮箱格式不正确',
                },
            ]"
        />

        <van-field
            v-model="vercode"
            name="vercode"
            center
            clearable
            label="邮箱验证码"
            placeholder="请输入邮箱验证码"
            :rules="[{ required: true, message: '请输入邮箱验证码' }]"
        >
            <template #button>
                <van-button
                    size="small"
                    type="primary"
                    @click="OnSend"
                    :disabled="disabled"
                >
                    {{ msg }}
                </van-button>
            </template>
        </van-field>

        <div style="width: 80%; margin: 2em auto">
            <van-button :loading="loading" round block type="primary" native-type="submit">
                提交
            </van-button>
        </div>
    </van-form>
</template>


<script setup>
const { proxy } = getCurrentInstance();

const business = proxy.$business;

const vercode = ref('');
const disabled = ref(false);
const msg = ref('发送验证码');
const loading = ref(false);

onBeforeMount(() =>
{
    if(!business.value.email)
    {
        proxy.$success('请去基本资料修改邮箱',() => proxy.$router.back());

        return false;
    }

    if(business.value.auth == 1)
    {
        proxy.$success('您已完成邮箱认证了，无须重复认证',() => proxy.$router.back());

        return false;
    }
});

const OnSend = async () =>
{
    const params = {
        id:business.value.id,
        email:business.value.email
    }

    const result = await proxy.$http.post({
        url:'/email/send',
        params
    });

    msg.value = '正在发送中.....';
    disabled.value = true;

    if(result.code === 1)
    {
        proxy.$success(result.msg,()  => {
            const action = result.data ? result.data.action : false;

            if(action === true)
            {
                proxy.$success(result.msg,() => proxy.$router.back());
            }else{
                msg.value = 60;

                let T = setInterval(() =>
                {
                    if(msg.value <= 0)
                    {
                        // 停止定时器
                        clearInterval(T);
                        msg.value = '重新发送验证码';
                        disabled.value = false;
                    }else
                    {
                        msg.value--;
                    }
                }, 100);
            }
        })
    }else{
        proxy.$fail(result.msg,() => {
            msg.value = '发送验证码';
            disabled.value = false;
        });
    }
}

const OnSubmit = async (values) =>
{
    loading.value = true;

    const params = {
        id:business.value.id,
        code:values.vercode,
        email:values.email
    }

    const result = await proxy.$http.post({
        url:'/email/check',
        params
    });

    loading.value = false;

    if(result.code === 1)
    {
        proxy.$success(result.msg,() => proxy.$router.back());
    }else{
        proxy.$fail(result.msg);
    }
}
</script>